<template>
    <div>
        <el-page-header content='创建/编辑文章' @back='$router.back()'></el-page-header>
        <el-form label-width="120px" :model='createForm' :rules='rules' ref='form'>
            <el-form-item label="文章标题" prop='title'>
                <el-input v-model='createForm.title'></el-input>
            </el-form-item>
            <el-form-item label="文章分类" prop='type_id'>
                <o-select code='articleTypes' v-model="createForm.type_id" select-type='common'></o-select>
            </el-form-item>
            <el-form-item label="封面图" prop='img_url'>
                <o-upload v-model='createForm.img_url'></o-upload>
            </el-form-item>
            <el-form-item label="文章内容" prop='content'>
                <o-editor v-model='createForm.content'></o-editor>
            </el-form-item>
            <el-form-item>
                <el-button type='primary' @click='confirm'>保 存</el-button>
            </el-form-item>
        </el-form>
    </div>
</template>

<script>
    import {formCheck, toast} from '@u';
    import {MISS_REQUIRE_FORM_MESSAGE} from '@const';
    export default {
        data () {
            return {
                createForm : {
                    title : null, //标题
                    keyword : null, //关键字
                    img_url : null, //封面图
                    content : null, //富文本内容
                    type_id : null,//文章分类
                },
                rules : {
                    title : [{required: true, message : MISS_REQUIRE_FORM_MESSAGE}],
                    img_url : [{required: true, message : MISS_REQUIRE_FORM_MESSAGE}],
                    content : [{required: true, message : MISS_REQUIRE_FORM_MESSAGE}],
                    type_id : [{required: true, message : MISS_REQUIRE_FORM_MESSAGE}],
                }
            }
        },
        created () {
            if (this.$route.params.id) {
                // console.log(this.$route.query);
                this.createForm = JSON.parse(this.$route.query.articelDetail)
                console.log(this.createForm);
            }
        },
        methods : {
            confirm () {
                formCheck(this.$refs.form).then(_ => {
                    let promise = this.$route.params.id ? this.__api.contentApi.articleUpdate : this.__api.contentApi.articleCreate;
                    promise(this.createForm).then(_ => {
                        toast('操作成功');
                        this.$router.back();
                    })
                    
                }).catch(_ => {
                    console.log(2);
                })
            }
        }
    }
</script>

<style>

</style>